<template>
<svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
	 viewBox="0 0 75 19" enable-background="new 0 0 75 19" xml:space="preserve">
<g class="button">
	<g >
		<path fill="#6DA9DC" d="M60.2,15.2H7V0h53.2V15.2z M7.8,14.4h51.6V0.8H7.8V14.4z"/>
		<path fill="#6DA9DC" d="M70.3,15.2h-7.4V0h7.4V15.2z M63.7,14.4h5.9V0.8h-5.9V14.4z"/>
		<rect x="65" y="2.4" fill="#6DA9DC" width="3.5" height="3.2"/>
		<rect x="10.1" y="2.9" opacity="0.2" :fill="ifhove?'#00FFFF':'#6DA9DC'" width="36.6" height="9.2"/>
		<rect x="7.4" y="18.1" fill="#6DA9DC" width="14.2" height="2"/>
		<rect x="23.1" y="18.1" fill="#6DA9DC" width="2.1" height="2"/>
		<rect x="28.4" y="18.1" fill="#6DA9DC" width="24.4" height="1"/>
		<rect x="54.1" y="17.8" fill="#6DA9DC" width="1.8" height="1.4"/>
		<polygon fill="#6DA9DC" points="57.8,12.5 48.4,12.5 48.4,11.7 57.1,11.7 57.1,3.3 48.4,3.3 48.4,2.5 57.8,2.5 "/>
		<rect x="72.8" y="0.4" fill="#6DA9DC" width="1.8" height="14.4"/>
<text transform="matrix(1 0 0 1 12.7648 9.3683)" :fill="ifhove?'#F8F8FF':'#67A7DB'" :stroke="ifhove?'#F8F8FF':'#67A7DB'" stroke-width="0.3" stroke-miterlimit="10" font-family="'AdobeSongStd-Light-GBpc-EUC-H'" font-size="6px">{{lable}}</text>
	</g>
	<rect x="0" y="6.5" fill="#6DA9DC" width="3.3" height="3.3"/>
</g>
</svg>
</template>
<script>
export default {
    name:'buttonSVG',
    props: {
      lable:{
        type:String,
        default: ''
      },
      ifhove:{
        type:Boolean,
        default:false
      }
    },
    data(){
        return{

        }
    },
}
</script>
<style scoped>
text{
	cursor: pointer;
}
</style>